<template>
  <a-form-model
    ref="formComp"
    :model="formData"
    layout="horizontal"
    class="AsteriskAfter newEditStyle h100 viewConditionStrategyFormComp">
    <template v-if="!taskId">
      <full-parent-dom-with-dask :loading="spinningLoading"></full-parent-dom-with-dask>
      <a-row>
        <a-col :md="24" :sm="24">
          <a-form-model-item :label="$t('policyName')" class="customFormModelItem bd" prop="name">
            {{ formData.name || '-' }}
          </a-form-model-item>
        </a-col>
      </a-row>
      <!-- 通用前置条件 -->
      <a-row>
        <a-col :md="24" :sm="24">
          <a-form-model-item :label="$t('tyqztj')" class="customFormModelItem">
          </a-form-model-item>
        </a-col>
      </a-row>
    </template>
    <a-row :gutter="40">
      <!-- SOC电量(%) -->
      <a-col :md="12" :sm="24">
        <a-row>
          <a-col :md="14" :sm="24">
            <a-form-model-item
              :colon="false"
            >
              {{ $t('socdl') }}
              <question-mark-tip :tip-title="$t('socdlTip')" :popupContainer="getPopupContainer">
              </question-mark-tip>
            </a-form-model-item>
          </a-col>
          <a-col :md="10" :sm="24">
            <a-form-model-item :colon="false" prop="lowestSoc">
              {{ formDataItems.lowestSoc || '-' }}
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-col>
      <!-- 蓄电池电压 -->
      <a-col :md="12" :sm="24">
        <a-row>
          <a-col :md="14" :sm="24" class="rightColLabel">
            <a-form-model-item
              :colon="false"
            >
              {{ $t('xdcdy') }}
              <question-mark-tip :tip-title="$t('xdcdyTip')" :popupContainer="getPopupContainer">
              </question-mark-tip>
            </a-form-model-item>
          </a-col>
          <a-col :md="10" :sm="24">
            <a-form-model-item
              :colon="false"
              prop="lowestVoltage"
            >
              {{ formDataItems.lowestVoltage || '-' }}
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-col>
    </a-row>
    <a-row class="mt12" :gutter="40">
      <!-- 倒计时时长(min) -->
      <a-col :md="12" :sm="24">
        <a-row>
          <a-col :md="14" :sm="24">
            <a-form-model-item
              :colon="false"
            >
              {{ $t('djssc') }}
              <question-mark-tip :tip-title="$t('djsscTip')" :popupContainer="getPopupContainer">
              </question-mark-tip>
            </a-form-model-item>
          </a-col>
          <a-col :md="10" :sm="24">
            <a-form-model-item
              :colon="false"
              prop="countDown"
            >
              {{ formDataItems.countDown || '-' }}
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-col>
      <!-- 下载失败次数 -->
      <a-col :md="12" :sm="24">
        <a-row>
          <a-col :md="14" :sm="24" class="rightColLabel">
            <a-form-model-item
              :colon="false"
            >
              {{ $t('xzsbcs') }}
              <question-mark-tip :tip-title="$t('xzsbcsTip')" :popupContainer="getPopupContainer">
              </question-mark-tip>
            </a-form-model-item>
          </a-col>
          <a-col :md="10" :sm="24">
            <a-form-model-item
              :colon="false"
              prop="failureNumber">
              {{ formDataItems.failureNumber || '-' }}
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-col>
    </a-row>
    <a-row class="mt12" :gutter="40">
      <!-- 可升级温度(℃) -->
      <a-col :md="12" :sm="24">
        <a-row>
          <a-col :md="14" :sm="24">
            <a-form-model-item
              :colon="false"
            >
              {{ $t('ksjcwd') }}
              <question-mark-tip :tip-title="$t('ksjcwdTip')" :popupContainer="getPopupContainer">
              </question-mark-tip>
            </a-form-model-item>
          </a-col>
          <a-col :md="10" :sm="24">
            <a-form-model-item
              :colon="false"
              prop="temperature">
              {{ formDataItems.temperature || '-' }}
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-col>
      <!-- 升级失败次数 -->
      <a-col :md="12" :sm="24">
        <a-row>
          <a-col :md="14" :sm="24" class="rightColLabel">
            <a-form-model-item>
              {{ $t('sjsbcs') }}
              <question-mark-tip :tip-title="$t('sjsbcsTip')" :popupContainer="getPopupContainer"></question-mark-tip>
            </a-form-model-item>
          </a-col>
          <a-col :md="10" :sm="24">
            <a-form-model-item>
              {{ formDataItems.upgradeFailureNumber || '-' }}
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-col>
    </a-row>
    <!-- 烧写设置 -->
<!--    <a-row>-->
<!--      <a-col :md="24" :sm="24">-->
<!--        <a-form-model-item :label="$t('sxSetting')" class="customFormModelItem" prop>-->
<!--          <a-row :gutter="40">-->
<!--            &lt;!&ndash; 是否自由烧写 &ndash;&gt;-->
<!--            <a-col :md="12" :sm="24">-->
<!--              <a-row>-->
<!--                <a-col :md="14" :sm="24">-->
<!--                  <a-form-model-item-->
<!--                    :colon="false"-->
<!--                  >-->
<!--                    {{ $t('sfzysx') }}-->
<!--                  </a-form-model-item>-->
<!--                </a-col>-->
<!--                <a-col :md="10" :sm="24">-->
<!--                  {{ $t(formDataItems.isFreeBurning ? 'yes':'no') }}-->
<!--                </a-col>-->
<!--              </a-row>-->
<!--            </a-col>-->
<!--            &lt;!&ndash; 自由烧写次数 &ndash;&gt;-->
<!--            <a-col :md="12" :sm="24">-->
<!--              <a-row>-->
<!--                <a-col :md="14" :sm="24">-->
<!--                  <a-form-model-item-->
<!--                    :colon="false"-->
<!--                  >-->
<!--                    {{ $t('zysxCount') }}-->
<!--                  </a-form-model-item>-->
<!--                </a-col>-->
<!--                <a-col :md="10" :sm="24">-->
<!--                  <a-form-model-item-->
<!--                    :colon="false"-->
<!--                    class="customFormModelItem"-->
<!--                    prop="freeBurningTime"-->
<!--                  >-->
<!--                    {{ formDataItems.freeBurningTime || '-' }}-->
<!--                  </a-form-model-item>-->
<!--                </a-col>-->
<!--              </a-row>-->
<!--            </a-col>-->
<!--          </a-row>-->
<!--        </a-form-model-item>-->
<!--      </a-col>-->
<!--    </a-row>-->
  </a-form-model>
</template>
<script>
import FullParentDomWithDask from '@/components/LoadDataSpin/FullParentDomWithDask.vue'
import QuestionMarkTip from '@/views/components/QuestionMarkTip'
import { strategyInitFormData, strategyInitFormItems } from '../config/form'
import lodash from 'lodash'
import strategyApi from "@api/modules/strategy";
export default {
  components: {
    FullParentDomWithDask,
    QuestionMarkTip
  },
  props: {
    id: {
      type: String,
      default: ''
    },
    taskId: {
      type: String,
      default: ''
    },
    name: {
      type: String,
      default: ''
    },
    time: {
      type: Number,
      default: 78140
    },
  },
  data () {
    return {
      formData: lodash.cloneDeep(strategyInitFormData),
      formDataItems: lodash.cloneDeep(strategyInitFormItems),
      spinningLoading: false
    }
  },
  watch: {
    time: {
      handler () {
        this.resetFormData()
        if (this.id) {
          this.getDetailData()
        }
      },
      immediate: true
    }
  },
  methods: {
    // 获取详情数据
    getDetailData () {
      this.spinningLoading = true
      let promise;
      if (this.taskId) {
        promise = strategyApi.getTaskConditionById(this.taskId);
      } else if (this.id) {
        promise = this.$store.dispatch('getStrategyDetailData', {id: this.id});
      } else {
        console.error("条件策略详情 id taskId 都为空")
        return;
      }
      promise.then(res => {
        const data = res.data
        if (data) {
          this.formData.name = data.name
          //任务级别条件为data，升级策略条件为 data.items
          this.setFormDataItems(data.items || data)
        }
      }).finally(() => {
        this.spinningLoading = false
      });
    },
    // 编辑时设置已配置的选项
    setFormDataItems (items) {
      const obj = {}
      items.forEach(item => {
        obj[item.code] = item.value
      })
      this.formDataItems = obj
    },
    // eslint-disable-next-line no-unused-vars
    resetFormData () {
      this.formData = lodash.cloneDeep(strategyInitFormData)
      this.formDataItems = lodash.cloneDeep(strategyInitFormItems)
    },
    getPopupContainer (node) {
      return node.parentNode.parentNode
    }
  }
}
</script>
<style scoped lang="less">
.viewConditionStrategyFormComp {
  // overflow: auto;
  position: relative;
   .bd {
    border-bottom: 1px solid @borderColor;
  }
}
</style>
